"use strict";
var $ = {
    one(slt) {
        return document.querySelector(slt);
    },
    all(slt) {
        return document.querySelectorAll(slt);
    },
};
class Danmu {
    constructor() {
        this.strackNmb = 10;
        this.trackBox = $.one(".track-box");
        this.setStrack();
        this.pause();
    }
    setStrack() {
        let height = Math.floor(this.trackBox.offsetHeight / this.strackNmb);
        let strackHtml = "";
        for (let n = 0; n < this.strackNmb; n++) {
            strackHtml += `<li style="line-height:${height}px;height:${height}px"></li>`;
        }
        this.trackBox.innerHTML = strackHtml;
    }
    createOne(text) {
        let sn = Danmu.rand(this.strackNmb, 0);
        let lis = this.trackBox.querySelectorAll("li");
        let one = document.createElement('span');
        one.innerHTML = text + " <b data-zan='0' class='zan'></b>";
        one.dataset.left = "0";
        one.style.color = Danmu.color();
        one.style.fontSize = Danmu.rand(26, 16) + "px";
        lis[sn].append(one);
        this.move(one);
    }
    move(one) {
        let speed = one.dataset.speed || Danmu.rand(150, 75);
        let timer = setInterval(() => {
            let left = Number(one.dataset.left);
            if (left < -(this.trackBox.offsetWidth + one.offsetWidth)) {
                clearInterval(timer);
                one.remove();
            }
            one.dataset.timer = String(timer);
            one.dataset.speed = speed;
            left -= 20;
            one.dataset.left = String(left);
            one.style.transform = "translateX(" + (left - 20) + "px" + ")";
        }, speed);
    }
    good(one) {
        let b = one.querySelector("b");
        let zan = String(Number(b.dataset.zan) + 1);
        b.dataset.zan = zan;
        b.innerHTML = zan;
    }
    pause() {
        this.trackBox.onmouseover = event => {
            let one = event.target;
            if (one.nodeName != 'SPAN')
                return;
            let timer = Number(one.dataset.timer);
            clearInterval(timer);
        };
        this.trackBox.onmouseout = event => {
            let one = event.target;
            if (one.nodeName != 'SPAN')
                return;
            this.move(one);
        };
        this.trackBox.onclick = event => {
            let one = event.target;
            if (one.nodeName != 'SPAN')
                return;
            let timer = Number(one.dataset.timer);
            clearInterval(timer);
            this.good(one);
        };
    }
    static rand(max, min) {
        return Math.floor(Math.random() * (max - min)) + min;
    }
    static color() {
        return `rgb(
			${Danmu.rand(250, 200)},
			${Danmu.rand(250, 0)},
			${Danmu.rand(250, 0)}
		)`;
    }
}
class SendDanmu {
    static self() {
        if (!SendDanmu.instance) {
            SendDanmu.instance = new SendDanmu();
        }
        return SendDanmu.instance;
    }
    getText() {
        let input = $.one("#myDanmu");
        let text = input.value;
        text = text.replace(/^\s*|\s*$/g, '');
        if (text.length < 2 || text.length > 40)
            return { stat: false, text: "请输入2~40个字符" };
        let filterRegexp = new RegExp(SendDanmu.filterWords, 'ig');
        text = text.replace(filterRegexp, '*');
        return { stat: true, text };
    }
    sendOne() {
        let rText = this.getText();
        if (!rText.stat) {
            alert(rText.text);
            return;
        }
        dm.createOne(rText.text);
    }
    submit(dm) {
        $.one("#myDanmuButton").onclick = () => {
            this.sendOne();
        };
        $.one("#myDanmu").onkeyup = (event) => {
            if (event.keyCode == 13) {
                this.sendOne();
            }
        };
    }
}
SendDanmu.filterWords = 'b|草|妈';
SendDanmu.instance = null;
let dm = new Danmu;
SendDanmu.self().submit(dm);
